@mixin page2-box($w, $h, $bgc:transparent) {
    width: $w;
    height: $h;
    background-color: $bgc;
}
.web{
    margin: 0 auto;
    @include page2-box(1000px, 1662px,);
    // 主体部分
    .base{
        display: flex;
        position: relative;
        @include page2-box(1000px,883px ,transparent );
        // 导航栏
        .base-nav{
            position: absolute;
            display: flex;
            align-items: center;
              top: 45px;
             left: 51px;
             background-image: url(../img/page2/形状7.png);
        @include page2-box(900px,30px , transparent);
        p{
            font-family: MicrosoftYaHei;
            font-size: 16px;
            font-weight: normal;
            letter-spacing: 0px;
            color: #000000;
         }
        }
        // 筛选
        .sift-usage{
            display: flex;
            justify-content: space-between;
            flex-direction: column;
            margin: 105px 284px 651px 51px;
            @include page2-box(665px,128px ,transparent);
            // 按类型
            .types{
                display: flex;
                justify-content: space-between;
                flex-direction: row;
                align-items: center;
                @include page2-box(590px,38px ,transparent );
                .icon-f1{
                    background-image: url(../img/page2/矢量智能对象.png);
                    @include page2-box(38px,38px , transparent);
                }
                .words-f1{
                    @include page2-box(543px,17px ,transparent );
                    p{
                        font-family: MicrosoftYaHei;
	                    font-size: 14px;
	                    font-weight: normal;
	                     letter-spacing: 0px;
	                     color: #000000;
                         span{
                            a{
                                text-decoration: none;
                                font-family: MicrosoftYaHei;
                               font-size: 12px;
                                  font-weight: normal;
                                  border-right: 5px;
                              letter-spacing: 0px;
                               color: #000000;
                            }
                            a:hover{
                                color: skyblue;
                            }   
                         }
                    }
                }
            }
            // 按行业
            .industry{
                display: flex;
                justify-content: space-between;
                flex-direction: row;
                align-items: center;
                @include page2-box(635px,38px ,transparent );
                .icon-f2{
                    background-image: url(../img/page2/矢量智能对象.png);
                    @include page2-box(38px,38px ,transparent );
                }
                .words-f2{
                @include page2-box(588px,16px ,transparent);
                p{
                    font-family: MicrosoftYaHei;
                    font-size: 14px;
                    font-weight: normal;
                     letter-spacing: 0px;
                     color: #000000;
                     span{
                        a{
                            text-decoration: none;
                            font-family: MicrosoftYaHei;
                           font-size: 12px;
                              font-weight: normal;
                              border-right: 5px;
                          letter-spacing: 0px;
                           color: #000000;
                        }
                        a:hover{
                            color: skyblue;
                        }   
                     }
                }
                }
            }
            // 按地区
            .region{
                display: flex;
                justify-content: space-between;
                flex-direction: row;
                align-items: center;
                @include page2-box(665px,38px ,transparent );
                .icon-f3{
                    background-image: url(../img/page2/矢量智能对象.png);
                    @include page2-box(38px,38px ,transparent );
                }
                .words-f3{
                    @include page2-box(619px, 17px, transparent);
                    p{
                        font-family: MicrosoftYaHei;
                        font-size: 14px;
                        font-weight: normal;
                         letter-spacing: 0px;
                         color: #000000;
                         span{
                            a{
                                text-decoration: none;
                                font-family: MicrosoftYaHei;
                               font-size: 12px;
                                  font-weight: normal;
                                  border-right: 5px;
                              letter-spacing: 0px;
                               color: #000000;
                            }
                            a:hover{
                                color: skyblue;
                            }   
                         }
                    }
                }
 
            }
        }
        // 项目详细显示
        .outcome{
            display: flex;
            position: absolute;
            top: 257px;
            left: 51px;
            
            @include page2-box(900px,570px ,#fafafa );
            .outcome-title{
                background-image: url(../img/page2/矩形9.png);
                @include page2-box(900px,38px ,transparent  );
                .pro_name{
                    position: absolute;
                    top: 10px;
                    left: 123px;
                    @include page2-box(65px,16px ,transparent );
                }
                .location{
                    position: absolute;
                    top: 10px;
                    left: 270px;
                    @include page2-box(64px,16px ,transparent );
                }
                .at_indust{
                    position: absolute;
                    top: 10px;
                    left: 432px;
                    @include page2-box(33px,16px ,transparent  );
                }
                .waht-types{
                    position: absolute;
                    top: 10px;
                    left: 579px;
                    @include page2-box(32px,16px ,transparent  );
                }
                .time_pub{
                    position: absolute;
                    top: 10px;
                    left: 710px;
                    @include page2-box(64px,16px ,transparent  );
                }

            }
            .out-content{
                display: flex;
                position: absolute;
                top: 57px;
                left: 71px;
                @include page2-box(706px,497px ,transparent );
                .pro-name{
                display: flex;
                 flex-direction: column;
                 justify-content: space-between;
                @include page2-box(167px,497px ,transparent );
                .gzth{
                    background-image: url(../img/page2/[广州天河龙洞]可圈可点茶餐厅.png);
                    @include page2-box(167px,13px ,transparent );
                }
                }
                .belong-region{
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                       margin-left: 50px;
                    @include page2-box(27px, 497px, transparent);
                    .gd{
                        background-image: url(../img/page2/广东.png);
                        @include page2-box(25px, 13px,transparent );
                    }
                }
                .belong-industry{
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                    margin-left: 112px;
                    @include page2-box(49px,497px ,transparent );
                    .rest{
                        background-image: url(../img/page2/餐饮餐馆.png);
                        @include page2-box(49px, 13px, transparent);
                    }
                }
                .belong-types{
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                    margin-left: 98px;
                    @include page2-box(49px,497px ,transparent );
                    .gfzr{
                        background-image: url(../img/page2/股权转让.png);
                        @include page2-box(49px,13px ,transparent);
                    }
                }    
                .pub-date{
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                    margin-left: 90px;
                    @include page2-box(66px,497px ,transparent );
                    .pub-time{
                        background-image: url(../img/page2/2015-06-09.png);
                        @include page2-box(66px,13px ,transparent );
                    }
                }
            }
        }
        // 翻页
        .page-wrap{
            display: flex;
            position: absolute;
            top: 847px;
            left: 343px;
            justify-content: space-between;
            flex-direction: row;
            @include page2-box(212px,18px ,transparent );
            .previous-page{
                @include page2-box(49px,18px , transparent);
                button{
                    display: flex;
                    align-items: center;
                    border: 0px;
                     font-size: 7px;
                     position: relative;
                     @include page2-box(49px,18px ,#e5e5e5);
                     a{
                        text-decoration: none;
                        display: flex;
                        position: absolute;
                        align-items: center;
                        justify-content: center;
                        left: 0px;
                        @include page2-box(100%,100% ,transparent );
                      }
                      a:hover{
                          color: white;
                          background-color: skyblue;
                      }
                     }
            }
            .page-1{
                @include page2-box(18px,18px ,transparent);
                button{
                    display: flex;
                    align-items: center;
                    border: 0px;
                     font-size: 7px;
                     position: relative;
                     @include page2-box(18px,18px ,#e5e5e5);
                     a{
                        text-decoration: none;
                        display: flex;
                        position: absolute;
                        align-items: center;
                        justify-content: center;
                        left: 0px;
                        @include page2-box(100%,100% ,transparent );
                      }
                      a:hover{
                          color: white;
                          background-color: skyblue;
                      }
                     }
                }
            .page-2{
                @extend .page-1;
                @include page2-box(18px,18px ,transparent );
            }
            .page-3{
                @extend .page-1;
                @include page2-box(18px,18px ,transparent );
            }
            .page-4{
                @extend .page-1;
                @include page2-box(18px,18px ,#e5e5e5);
             
            }
            .page-5{
                @extend .page-1;
                @include page2-box(18px,18px ,#e5e5e5 );
            }
            .next-page{
            @extend .previous-page;
                @include page2-box(49px,18px ,#e5e5e5 );
            }
      }            
 }
 hr{
     color: #eaedf0;
    margin: 0;
    padding: 0;
}
    
}


